<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Jekas  - Software, Studio and Corporate Responsive Template</title>    
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    
    <!-- Your styles -->
    <link href="css/style.css" rel="stylesheet" media="screen">

     <!-- Favicons
    ================================================== -->
    <link rel="shortcut icon" href="img/icons/favicon.ico">
    <link rel="apple-touch-icon" href="img/icons/apple-touch-icon.png">
    <link rel="apple-touch-icon" sizes="72x72" href="img/icons/apple-touch-icon-72x72.png">
    <link rel="apple-touch-icon" sizes="114x114" href="img/icons/apple-touch-icon-114x114.png">    

    <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

    <!-- styles for IE -->
    <!--[if lte IE 8]>
    <link rel="stylesheet" href="css/ie/ie.css" type="text/css" media="screen" />
    <![endif]-->
   
  </head>
  <body> 
    <div class="container wraper">
        <!-- Header-->
        <header class="section_title">            
            <!-- nav_logo-->
            <div class="nav_logo animated fadeInDown delay1">            
                <div class="container">
                    <div class="row-fluid">

                        <!-- Logo-->
                        <div class="span3 logo">
                            <a href="index.html" title="Back to Home">                            
                                <img src="img/logo.png" alt="Logo">
                            </a>
                        </div>
                        <!-- End Logo-->
                                                      
                        <!-- Nav-->
                        <nav class="span9">
                            <!-- Menu-->
                            <ul id="menu" class="sf-menu">
                                <li>
                                    <a href="index.html">HOME</a>
                                    <ul>                                  
                                        <li><a href="index.html">Camera Slider</a></li>
                                        <li><a href="index_static.html">Static Header</a></li>
                                    </ul>
                                </li>
                                <li><a href="about.html">ABOUT</a></li>
                                <li><a href="services.html">SERVICES</a></li>
                                <li>
                                    <a href="work.html">WORK</a>
                                    <ul>                                  
                                        <li><a href="work3.html">3 Columns</a></li>
                                        <li><a href="work.html">4 Columns</a></li>
                                        <li><a href="single_work.html">Single Work</a></li>
                                    </ul>
                                </li>
                                 <li>
                                    <a href="blog.html">BLOG</a>
                                    <ul>                                  
                                        <li><a href="blog.html">Post</a></li>
                                        <li><a href="single_post.html">Single Post</a></li>
                                    </ul>
                                </li>
                                <li>
                                    <a href="tables_princing.html">FEATURES</a>
                                    <ul>                                  
                                        <li><a href="tables_princing.html">Princing Tables</a></li>
                                        <li><a href="grid.html">Grind System</a></li>
                                        <li><a href="typograpy.html">Tipograpy</a></li>
                                        <li><a href="icons.html">Icons</a></li>
                                        <li><a href="elements.html">Elements</a></li>
                                    </ul>
                                </li>                                                        
                                <li><a href="contact.html">CONTACT</a></li>
                            </ul>
                            <!-- End Menu-->
                        </nav>
                        <!-- End Nav-->
                                                 
                    </div>
                </div>
            </div>
            <!-- End nav_logo-->

            <!-- Info section Title-->
            <div class="container">
                <div class="row-fluid animated fadeInUp delay1">
                    <div class="span5">
                        <h1>Typograpy</h1>
                    </div>
                    <div class="span7">                        
                        <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac.</p>
                    </div>
                </div>
            </div>            
            <!-- End Info section Title--> 

        </header>
        <!-- End Header-->

        <!-- crumbs-->
        <div class="crumbs border_bottom">
            <div class="container">
                <ul>
                    <li><a href="index.html">Home</a></li>
                    <li>/</li>
                    <li>Features</li>
                    <li>/</li>
                    <li>Typograpy</li>                                       
                </ul>
            </div>        
        </div>
        <!-- End crumbs-->

        <!-- End content info -->
        <section class="content_info">
            <div class="container center_info">
                 <div class="row-fluid padding_top">
                        <div class="span6">
                            <h1>H1 Heading</h1>
                            <p>Pellentesque pellentesque eget tempor tellus. Fusce lacllentesque eget tempor tellus ellentesque pelleinia tempor malesuada. Pellentesque pellentesque eget tempor tellus ellentesque pellentesque eget tempor tellus. Fusce lacinia tempor malesuada.</p>

                            <h2>H2 Heading</h2>
                            <p>Pellentesque pellentesque usce lacllentesque eget tempor tellus ellentesque pelleinia tempor malesuada. Pellentesque pellentesque eget tempor tellus ellentesque pellentesque eget tempor tellus.  tellus eget tempor. Fusce lacinia tempor malesuada.</p>

                            <h3>H3 Heading</h3>
                            <p>Pellentesque tempor tellus eget pellentesque. usce lacllentesque eget tempor tellus ellentesque pelleinia tempor malesuada. Pellentesque pellentesque eget tempor tellus ellentesque pellentesque eget tempor tellus.  Fusce lacinia tempor malesuada.</p>

                            <h4>H4 Heading</h4>
                            <p>Pellentesque pellentesque tempor tellus eget fermentum. usce lacllentesque eget tempor tellus ellentesque pelleinia tempor malesuada. Pellentesque pellentesque eget tempor tellus ellentesque pellentesque eget tempor tellus. </p>

                            <h5>H5 Heading</h5>
                            <p>Pellentesque pellentesque tempor llentesque pellentesque tempor tellus eget libero llentesque pellentesque tempor tellus eget libero tellus ementellentesque tempor tellus eget fermentum. usce lacllentesque eget tempor tellus ellenellentesque tempor tellus eget fermentum. usce lacllentesque eget tempor tellus ellenum.</p>

                            <h6>H6 Heading</h6>
                            <p>Pellentesque pellentesque tempor tellus eget libero</p>

                        </div>

                        <div class="span6">

                            <h2 class="spaced">Heading Helper Classes</h2>
                            <p><span class="label label-info">Heads up!</span> You can use helper classes in order to align better the titles.<br><strong>Such as:</strong> short, shorter, tall, taller, spaced, more-spaced and page-header.</p>

                            <h2 class="more-spaced">Blockquote</h2>
                            <blockquote>
                                Mauris aliquet ultricies ante, non faucibus ante gravida sed. Sed ultrices pellentesque purus, vulputate volutpat ipsum hendrerit sed neque sed sapien rutrum laoreet justo ultrices. In pellentesque lorem condimentum dui morbi pulvinar dui non quam pretium ut lacinia tortor.
                                <small>Someone famous <cite title="Source Title">Source Title</cite></small>
                            </blockquote>

                            <h2 class="more-spaced">Paragraph</h2>

                            <p class="lead">Mauris aliquet ultricies ante, non faucibus ante gravida sed. Sed ultrices pellentesque purus, vulputate.</p>

                            <p class="lead">Check the <span class="alternative-font">alternative</span> font style.</p>

                            <p>Check the <span class="alternative-font">alternative</span> font style.</p>

                            <p>Mauris <a class="tooltip_hover" data-placement="top" href="#" data-original-title="Tooltip!">tooltip</a> aliquet <a href="#">link</a> ultricies ante, non <strong>bold</strong> faucibus ante gravida sed. Sed ultrices <em>rendered as italicized text</em> pellentesque purus, vulputate volutpat ipsum hendrerit sed neque..</p>

                            <p>
                              <small>This line of text is meant to be treated as fine print.</small>
                            </p>

                            <p class="muted">Fusce dapibus, tellus ac cursus commodo, tortor mauris nibh.</p>
                            <p class="text-warning">Etiam porta sem malesuada magna mollis euismod.</p>
                            <p class="text-error">Donec ullamcorper nulla non metus auctor fringilla.</p>
                            <p class="text-info">Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis.</p>
                            <p class="text-success">Duis mollis, est non commodo luctus, nisi erat porttitor ligula.</p>

                        </div>
                    </div>

                    <div class="divisor"></div>

                    <div class="row-fluid">
                        <div class="span12">
                            <h2>Lists</h2>
                        </div>
                    </div>

                    <div class="row-fluid">
                        <div class="span6">

                            <h4>Unordered</h4>

                            <ul>
                                <li>Lorem ipsum dolor sit amet</li>
                                <li>Consectetur adipiscing elit</li>
                                <li>Integer molestie lorem at massa</li>
                                <li>Facilisis in pretium nisl aliquet</li>
                                <li>
                                    Nulla volutpat aliquam velit
                                    <ul>
                                        <li>Phasellus iaculis neque</li>
                                        <li>Purus sodales ultricies</li>
                                        <li>Vestibulum laoreet porttitor sem</li>
                                        <li>Ac tristique libero volutpat at</li>
                                    </ul>
                                </li>
                                <li>Faucibus porta lacus fringilla vel</li>
                                <li>Aenean sit amet erat nunc</li>
                                <li>Eget porttitor lorem</li>
                            </ul>

                            <h4 class="spaced">Unstyled</h4>

                            <ul class="unstyled">
                                <li>Lorem ipsum dolor sit amet</li>
                                <li>Consectetur adipiscing elit</li>
                                <li>Integer molestie lorem at massa</li>
                                <li>Facilisis in pretium nisl aliquet</li>
                                <li>Faucibus porta lacus fringilla vel</li>
                                <li>Aenean sit amet erat nunc</li>
                                <li>Eget porttitor lorem</li>
                            </ul>

                            <h4 class="spaced">Description</h4>

                            <dl>
                                <dt>Description lists</dt>
                                <dd>A description list is perfect for defining terms.</dd>
                                <dt>Euismod</dt>
                                <dd>Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.</dd>
                                <dd>Donec id elit non mi porta gravida at eget metus.</dd>
                                <dt>Malesuada porta</dt>
                                <dd>Etiam porta sem malesuada magna mollis euismod.</dd>
                            </dl>

                        </div>
                        <div class="span6">

                            <h4 class="spaced">Ordered</h4>

                            <ol>
                                <li>Lorem ipsum dolor sit amet</li>
                                <li>Consectetur adipiscing elit</li>
                                <li>Integer molestie lorem at massa</li>
                                <li>Facilisis in pretium nisl aliquet</li>
                                <li>Faucibus porta lacus fringilla vel</li>
                                <li>Aenean sit amet erat nunc</li>
                                <li>Eget porttitor lorem</li>
                                <li>Consectetur adipiscing elit</li>
                                <li>Integer molestie lorem at massa</li>
                                <li>Facilisis in pretium nisl aliquet</li>
                                <li>Faucibus porta lacus fringilla vel</li>
                                <li>Aenean sit amet erat nunc</li>
                            </ol>

                            <h4 class="spaced">Icons</h4>

                            <ul class="list icons">
                                <li><i class="icon-ok"></i> Fusce sit amet orci quis arcu vestibulum vestibulum sed ut felis.</li>
                            <li><i class="icon-coffee"></i> Phasellus in risus quis lectus iaculis vulputate id quis nisl.</li>
                                <li><i class="icon-envelope-alt"></i> Fusce sit amet orci quis arcu vestibulum vestibulum sed ut felis. </li>
                                <li><i class="icon-film"></i> Phasellus in risus quis lectus iaculis vulputate id quis nisl.</li>
                                <li><a href="icons.html">...more icons</a></li>
                            </ul>

                            <h4 class="spaced">Inline</h4>

                            <ul class="inline">
                                <li>Lorem ipsum</li>
                                <li>Phasellus iaculis</li>
                                <li>Nulla volutpat</li>
                            </ul>

                        </div>
                    </div>

                    <div class="divisor"></div>

                    <div class="row-fluid">
                        <div class="span12">
                            <h2>Code</h2>
                        </div>
                    </div>

                    <div class="row-fluid">
                        <div class="span6">

                            <h4>Inline</h4>

                            <p>For example, <code>&lt;section&gt;</code> should be wrapped as inline.</p>

                        </div>
                        <div class="span6">

                            <h4>Basic Block</h4>

                            <pre>&lt;p&gt;Sample text here...&lt;/p&gt;</pre>

                        </div>
                    </div>

                    <div class="divisor"></div>

                    <div class="row-fluid">
                        <div class="span12">
                            <h2>Tables</h2>
                        </div>
                    </div>

                    <div class="row-fluid">
                        <div class="span12">

                            <h4>Striped</h4>

                            <table class="table table-striped">
                                <thead>
                                    <tr>
                                        <th>
                                            #
                                        </th>
                                        <th>
                                            First Name
                                        </th>
                                        <th>
                                            Last Name
                                        </th>
                                        <th>
                                            Username
                                        </th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td>
                                            1
                                        </td>
                                        <td>
                                            Mark
                                        </td>
                                        <td>
                                            Otto
                                        </td>
                                        <td>
                                            @mdo
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            2
                                        </td>
                                        <td>
                                            Jacob
                                        </td>
                                        <td>
                                            Thornton
                                        </td>
                                        <td>
                                            @fat
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            3
                                        </td>
                                        <td>
                                            Larry
                                        </td>
                                        <td>
                                            the Bird
                                        </td>
                                        <td>
                                            @twitter
                                        </td>
                                    </tr>
                                </tbody>
                            </table>

                            <h4 class="spaced">Bordered</h4>

                            <table class="table table-bordered">
                                <thead>
                                    <tr>
                                        <th>
                                            #
                                        </th>
                                        <th>
                                            First Name
                                        </th>
                                        <th>
                                            Last Name
                                        </th>
                                        <th>
                                            Username
                                        </th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td>
                                            1
                                        </td>
                                        <td>
                                            Mark
                                        </td>
                                        <td>
                                            Otto
                                        </td>
                                        <td>
                                            @mdo
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            2
                                        </td>
                                        <td>
                                            Jacob
                                        </td>
                                        <td>
                                            Thornton
                                        </td>
                                        <td>
                                            @fat
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            3
                                        </td>
                                        <td>
                                            Larry
                                        </td>
                                        <td>
                                            the Bird
                                        </td>
                                        <td>
                                            @twitter
                                        </td>
                                    </tr>
                                </tbody>
                            </table>

                        </div>
                    </div>
            </div>


            <!-- Sponsors-->
            <section class="info_resalt border_top margin_top">
                <div class="container">
                    <div class="row-fluid">
                        <div class="sponsors" id="sponsors">     
                            <ul class="slides">
                                <li>
                                    <a href="#"  class="tooltip_hover" title="Name Sponsor"><img src="img/sponsors/1.png" alt="Image"></a>
                                </li>
                                 <li>
                                    <a href="#"  class="tooltip_hover" title="Name Sponsor"><img src="img/sponsors/2.png" alt="Image"></a>
                                </li>
                                 <li>
                                    <a href="#"  class="tooltip_hover" title="Name Sponsor"><img src="img/sponsors/3.png" alt="Image"></a>
                                </li>
                                 <li>
                                    <a href="#"  class="tooltip_hover" title="Name Sponsor"><img src="img/sponsors/4.png" alt="Image"></a>
                                </li>
                                 <li>
                                    <a href="#"  class="tooltip_hover" title="Name Sponsor"><img src="img/sponsors/5.png" alt="Image"></a>
                                </li>
                                 <li>
                                    <a href="#"  class="tooltip_hover" title="Name Sponsor"><img src="img/sponsors/1.png" alt="Image"></a>
                                </li>
                                 <li>
                                    <a href="#"  class="tooltip_hover" title="Name Sponsor"><img src="img/sponsors/2.png" alt="Image"></a>
                                </li>
                                 <li>
                                    <a href="#"  class="tooltip_hover" title="Name Sponsor"><img src="img/sponsors/5.png" alt="Image"></a>
                                </li>
                                 <li>
                                    <a href="#"  class="tooltip_hover" title="Name Sponsor"><img src="img/sponsors/4.png" alt="Image"></a>
                                </li>                                
                                 <li>
                                    <a href="#"  class="tooltip_hover" title="Name Sponsor"><img src="img/sponsors/3.png" alt="Image"></a>
                                </li>
                                 <li>
                                    <a href="#"  class="tooltip_hover" title="Name Sponsor"><img src="img/sponsors/2.png" alt="Image"></a>
                                </li>
                                 <li>
                                    <a href="#"  class="tooltip_hover" title="Name Sponsor"><img src="img/sponsors/5.png" alt="Image"></a>
                                </li>
                            </ul> 
                        </div>                      
                    </div>                  
                </div> 
            </section>  
            <!-- End Sponsors--> 

        </section>
        <!-- End content info-->

        <!-- footer-->
        <footer>
            <div class="container">
                <div class="row-fluid">
                    
                    <!-- Follow Us-->
                    <div class="span2">
                        <h3>FOLLOW US</h3>
                        <ul class="social">
                            <li class="facebook"><span><i class="icon-facebook"></i></span><a href="#">Facebook</a></li>
                            <li class="twitter"><span><i class="icon-twitter"></i></span><a href="#">Twitter</a></li>
                            <li class="github"><span><i class="icon-github"></i></span><a href="#">Github</a></li>
                            <li class="linkedin"><span><i class="icon-linkedin"></i></span><a href="#">Linkedin</a></li>
                        </ul>
                    </div>
                    <!-- End Follow Us-->
                    
                    <!-- Recent links-->
                    <div class="span2">
                        <h3>RECENT LINKS</h3>
                        <ul>
                            <li><a href="#">Work</a></li>
                            <li><a href="#">About Us</a></li>
                            <li><a href="#">Services</a></li>
                            <li><a href="#">Contact Us</a></li>
                        </ul>
                    </div>
                    <!-- End Recent links-->

                    <!-- End Company-->
                    <div class="span2">
                        <h3>COMPANY</h3>
                        <ul>
                            <li><a href="#">Work</a></li>
                            <li><a href="#">About Us</a></li>
                            <li><a href="#">Services</a></li>
                            <li><a href="#">Contact Us</a></li>
                        </ul>
                    </div>
                    <!-- Company-->

                    <!-- Newsletter-->
                    <div class="span3">
                         <h3>NEWSLETTER SIGN UP</h3>  
                         <form>                    
                              <div class="input-prepend">
                                    <span class="add-on"><i class="icon-align-left"></i></span>                      
                                    <input type="text" required="" placeholder="Your Name">
                              </div>

                              <div class="input-prepend">
                                    <span class="add-on"><i class="icon-envelope"></i></span>                      
                                    <input type="email" required="" placeholder="Your Email">
                              </div>                    
                              
                              <input type="submit" value="Send" class="button">
                          </form>                      
                    </div>
                    <!-- end Newsletter-->

                    <!-- Contact Us-->
                    <div class="span3">
                       <h3>CONTACT US</h3>
                       <ul class="contact_footer">
                            <li>
                                <i class="icon-envelope"></i> <a href="#">example@example.com</a>
                            </li>
                            <li>
                                <i class="icon-headphones"></i> <a href="#">55-5698-4589</a>
                             </li>
                            <li class="location">
                                <i class="icon-home"></i> <a href="#"> Av new stret - New York</a>
                            </li>                                   
                        </ul>
                    </div>
                    <!-- Contact Us-->

                </div>
            </div>
        </footer>      
        <!-- End footer-->

        <!-- footer-->
        <footer class="coopring">
            <p>&copy; 2013 Jekas. All Rights Reserved.</p>
        </footer>      
        <!-- End footer-->
    </div>
   
        <!-- ======================= JQuery libs =========================== -->
        <!-- Always latest version of jQuery-->
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>   
        <!-- jQuery local-->      
        <script>window.jQuery || document.write('<script src="js/jquery-1.9.1.min.js"><\/script>')</script>
        <!-- jQuery ui-->    
        <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/jquery-ui.min.js"></script>
        <!--Nav-->
        <script type="text/javascript" src="js/nav/tinynav.js"></script> 
        <script type="text/javascript" src="js/nav/superfish.js"></script>                                             
        <!--Totop-->
        <script type="text/javascript" src="js/totop/jquery.ui.totop.js" ></script>  
        <!--Slide-->
        <script type="text/javascript" src="js/slide/camera.js" ></script>      
        <script type='text/javascript' src='js/slide/jquery.easing.1.3.min.js'></script>   
        <!--flexsilider-->
        <script type="text/javascript" src="js/carousel/jquery.flexslider.js"></script>    
        <!--Ligbox--> 
        <script type="text/javascript" src="js/fancybox/jquery.fancybox-1.3.1.js"></script>  
        <!--Scrollama--> 
        <script type="text/javascript" src="js/scrollama/TweenMax.min.js"></script>
        <script type="text/javascript" src="js/scrollama/jquery.superscrollorama.js"></script>    
        <!--Gallery Grid--> 
        <script type="text/javascript" src="js/gallery/modernizr.custom.26633.js"></script>
        <script type="text/javascript" src="js/gallery/jquery.gridrotator.js"></script>     
        <!--Minislider Team-->         
        <script type="text/javascript" src="js/team/modernizr.custom.63321.js"></script>
        <script type="text/javascript" src="js/team/jquery.catslider.js"></script> 
        <!--Filters-->
        <script type="text/javascript" src="js/filters/filters.js" ></script>                            
        <!-- Bootstrap.js-->
        <script type="text/javascript" src="js/bootstrap/bootstrap.js"></script>
        <!--fUNCTIONS-->
        <script type="text/javascript" src="js/jquery-func.js"></script>
        <!-- ======================= End JQuery libs =========================== -->


  </body>
</html>